<template>
    <a-collapse forceRender accordion :bordered='false'>
        <template v-for='(row, index) in rows' :key='index'>
            <Panel :row='row' :selectedApi='selectedApi' :valueFieldName='valueFieldName' :labelFieldName='labelFieldName' :childrenFieldName='childrenFieldName' />
        </template>
    </a-collapse>
</template>

<script lang='ts' setup>
    import Panel from './Panel.vue'
    withDefaults(defineProps<{
        rows : any[],
        valueFieldName : string,
        labelFieldName : string,
        childrenFieldName : string,
        selectedApi : (data : any) => void
    }>(), {
        rows : () => [],
        valueFieldName : 'id',
        labelFieldName : 'label',
        childrenFieldName : 'children'
    })
</script>
